KeyFrameCtl = Ext.extend(CmpControler, {

			bulidComponent : function() {

				var dataView = this.getDataView();

				var item = new Ext.Panel({
							id : 'file-view',
							title : '关键帧',
							region : 'center',
							split : true,
							autoScroll : true,
							items : dataView
						});

				return item;

			},
			getDataView : function() {

				var config = this.getDataViewConfig();

				var store = this.getStore();
				config.store = store;
				var tpl = this.getTpl();
				config.tpl = tpl;

				var dataView = new Ext.DataView(config);

				return dataView;

			},
			getDataViewConfig : function() {

				var config = {
					title : '关键帧',
					region : 'center',
					split : true,
					autoHeight : true,
					frame : true,
					multiSelect : true,
					overClass : 'x-view-over',
					itemSelector : 'div.thumb-wrap',
					emptyText : '没有关键帧'
				};

				return config;

			},
			getStore : function() {

				var url = this.getStoreUrl();
				var fields = this.getDateReader();
				var store = new Ext.data.JsonStore({
							url : url,
							totalProperty : 'totleSize',
							root : 'items',
							fields : fields
						});

				this.store = store;
				return store;

			},
			getDateReader : function() {
				return ['frame', 'filePath', 'timeCode','fileName'];
			},
			getTpl : function() {

				var url = cf.getC('s').getUrl();

				var src = url + 'keyframe.do?act=read&frame=';

				var tpl = new Ext.XTemplate('<tpl for=".">',
						'<div class="thumb-wrap" id="{frame}">',
						'<div class="thumb"><img src="' + src
								+ '{frame}&filePath={filePath}&fileName={fileName}" title="{frame}"></div>',
						'<span>{timeCode}</span></div>', '</tpl>');

				return tpl;

			},
			getStoreUrl : function() {

				var resource = 'keyFrameList.do';
				var server = cf.getC('s');
				var url = server.getUrl({
							resource : resource,
							act : 'r'
						});
				return url;
			},
			load : function(record) {
				this.setTask(record);
				var store = this.store;
				//alert(record.get('keyFramePath'));
				store.baseParams = {
					keyFramePath : record.get('keyFramePath')
				};
				store.load();
			},
			setTask : function(record) {
				this.task = record;
			}

		});
